import { getAntd,getEcCom } from '../../util/convert';
import './style/index.css'

class Group extends React.Component {
	constructor(props) {
        super(props);
        this.state = {
            showGroup: true
        }
    }

	render() {
        const {Row, Col, Icon} = getAntd();
        const {title,items,needTigger=true,col = 2,customComponent='',groupBodyComponent=''} = this.props;
        const {showGroup = false} = this.state;
        //console.log("items:",items);
        return (
            <div className="wea-group">
                <Row ecId={`${this && this.props && this.props.ecId || ''}_Row@7l4naa`} className="wea-title-row">
                    <Col ecId={`${this && this.props && this.props.ecId || ''}_Col@vv2yyx`} span="19">
                        <div className="wea-title">
                        	{title}
                        </div>
                    </Col>
                    {customComponent &&
                        <Col ecId={`${this && this.props && this.props.ecId || ''}_Col@k2w91x`} span={4} style={{textAlign:"right",paddingRight:10,fontSize:12}}>
                            {customComponent}
                        </Col>
                    }
                    {needTigger &&
	                    <Col ecId={`${this && this.props && this.props.ecId || ''}_Col@6me260`} span={customComponent?1:5} style={{textAlign:"right",paddingRight:10,fontSize:12}}>
	                        <i className={showGroup ? 'icon-coms-up' : 'icon-coms-down'} onClick={()=>this.setState({showGroup:!showGroup})}/>
	                    </Col>
                    }
                </Row>
                <div className="wea-group-content" style={{display:showGroup ? "block":"none"}}>
					{groupBodyComponent}                	
                </div>
            </div>
        )
    }
    
    setShowGroup(bool){
    	this.setState({showGroup:bool});
    }
    
}

export default Group